﻿<template>
    <div style="height:100%;">
        <Row>
            <Col span="24" class="col-margin">
            <!--根据需求删除不不要查询条件-->
           填报年份：
            <Select v-model="searchModel.FillInYear" placeholder="全部" :label-in-value="true" @on-change="initReport()" style="width:200px">
                <Option v-for="item in yearList" :value="item.DictValue" :key="item.DictValue">{{ item.DictText }}</Option>
            </Select>
            <!-- <Button icon="ios-search" type="ghost" @click="getPageData()">查询</Button> -->
            <Button icon="ios-download" type="info" @click="ExcelDown()" style="float:right;margin-right:20px" v-show="isCreated&&ReportStatus >1">数据导出</Button>
            <Upload :on-success="handleSuccess" :action="GetPostUrl()" style="float:right;margin-right:20px" v-show="isCreated&&ReportStatus <3">
                <Button type="success" icon="ios-cloud-upload-outline">数据导入</Button>
            </Upload>
            <Button icon="ios-download" type="warning" @click="TmpDown()" style="float:right;margin-right:20px">模板下载</Button>
            </Col>
        </Row>   
        <div v-show="isCreated">
        <Row class-name="col-margin">
            <Col span="12" >
            <Button icon="plus" type="primary" :disabled="ReportStatus>2" @click="addItem()">新增</Button>            
            </Col>
            <Col span="12" >
            <div style="float:right;font-size:16px;margin-right:50px;">当前状态：
                <label style="font-size:16px;margin-right:5px;">
                    <span v-if="ReportStatus==0" class="Error">退回重报</span>
                    <span v-else-if="ReportStatus==1" class="NoReport">未填写</span>
                    <span v-else-if="ReportStatus==2" class="AlreadyReport">已填写</span>
                    <span v-else-if="ReportStatus==3" class="UpReport">已上报</span>
                    <span v-else-if="ReportStatus==4" class="Success">审核通过</span>
                </label>
                <span style="float:right;" v-show="ReportStatus==0">[<a @click="ReasonShow=true">未通过原因</a>]</span>
            </div>
            </Col>
        </Row>     
        <Row>
            <Col span="24" class="col-margin">
            <div id="griddiv" style="overflow-y:auto" v-bind:style="{ height: clientHeight + 'px' }">
                <Form ref="dataModel" :model="{dataList}" >
                <table class="reptable">
                    <thead>
                        <tr>
                            <th colspan="2">组培苗</th>
                            <th colspan="5">原原种</th>
                            <th colspan="5">原种</th>
                            <th colspan="4">一级种</th>
                            <th rowspan="2">备注</th>
                            <th rowspan="2" class="ivu-table-column-center">操作</th>
                        </tr>
                        <tr>
                            <th>全年产量（万株）</th>
                            <th>品种</th>
                            <th>大棚面积（平方米）</th>
                            <th>单个生产周期种植面积（平方米）</th>
                            <th>平均产量（粒/平方米）</th>
                            <th>品种</th>
                            <th>全年繁种次数（次）</th>
                            <th>面积（亩）</th>
                            <th>亩产量（公斤）</th>
                            <th>原原种来源</th>
                            <th>品种</th>
                            <th>产地</th>
                            <th>面积（亩）</th>
                            <th>亩产量（公斤）</th>
                            <th>品种</th>
                            <th>产地</th>                            
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(dataModel,index) in dataList" :key="index">
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.ZPyield'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.ZPyield" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item  >
                                    <Select v-model="dataModel.ZPvariety" placeholder="请选择" :label-in-value="true"  style="width:85px">
                                        <Option v-for="item in VarietyList" :value="item.DictText" :key="item.DictValue">{{ item.DictText }}</Option>
                                    </Select>
                                </Form-item>
                            </td>
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YYZdpArea'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.YYZdpArea" ></Input>
                                </Form-item>
                            </td>
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YYZsingleArea'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.YYZsingleArea" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YYZavgYield'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.YYZavgYield" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item >
                                    <Select v-model="dataModel.YYZvariety" placeholder="请选择" :label-in-value="true"  style="width:85px">
                                        <Option v-for="item in VarietyList" :value="item.DictText" :key="item.DictValue">{{ item.DictText }}</Option>
                                    </Select>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YYZplantTimes'">
                                    <Input v-model="dataModel.YYZplantTimes" ></Input>
                                </Form-item> 
                            </td> 
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YZarea'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.YZarea" ></Input>
                                </Form-item>  
                            </td>
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YZmuYield'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.YZmuYield" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item >
                                    <Input v-model="dataModel.YZyyzOrigin" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item >
                                    <Select v-model="dataModel.YZvariety" placeholder="请选择" :label-in-value="true"  style="width:85px">
                                        <Option v-for="item in VarietyList" :value="item.DictText" :key="item.DictValue">{{ item.DictText }}</Option>
                                    </Select>
                                </Form-item> 
                            </td> 
                            <td>
                                <Form-item >
                                    <Input v-model="dataModel.YZoriginPlace" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YJZarea'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.YJZarea" ></Input>
                                </Form-item> 
                            </td> 
                            <td>
                                <Form-item  :prop="'dataList.' + index + '.YJZmuYield'" :rules="{validator: rule1, trigger: 'blur'}">
                                    <Input v-model="dataModel.YJZmuYield" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item  >
                                    <Select v-model="dataModel.YJZvariety" placeholder="请选择" :label-in-value="true"  style="width:85px">
                                        <Option v-for="item in VarietyList" :value="item.DictText" :key="item.DictValue">{{ item.DictText }}</Option>
                                    </Select>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item  >
                                    <Input v-model="dataModel.YJZoriginPlace" ></Input>
                                </Form-item> 
                            </td>
                            <td>
                                <Form-item  prop="Remark">
                                    <Input v-model="dataModel.Remark" type="textarea" :autosize="true" ></Input>
                                </Form-item>
                            </td>
                            <td>                               
                                <i-button type="ghost" size="small" icon="ios-trash-outline" style="color:#FF0000" @click="delInfo(index)">
                                    <span style="color:#000;">删除</span>
                                </i-button>
                            </td>
                        </tr>
                    </tbody>
                </table>
                </Form>
                <div class="divButton">
                    <Button type="primary" @click="save('dataModel')" :disabled="ReportStatus < 3? false:true ">保存</Button>
                    <Button type="primary" @click="DataUp()" :disabled="ReportStatus == 2 ? false:true">上报</Button>
                </div>
                <Alert style="margin-top:50px;text-align:left" type="error">
                    <p>填报时间：每年1月10日</p>
                    <p> 填报说明：1.全省范围内从乡（镇）起，逐级全面统计，由县级填报经州（市）审核后上报。</p>
                    <span slot="desc"></span>
                </Alert>
            </div>            
            </Col>
        </Row>
        </div>
        <div v-show="!isCreated" class="NoCreatedDiv">
            <h1>{{ReportLine}}</h1>
        </div>
        <Modal v-model="ReasonShow" :mask-closable="false" width="500"> 
            <p slot="header" class="title">
                <Icon type="ios-paper" size="20"></Icon>
                <span style="font-size: 20px">未通过原因</span>
            </p>
            <p slot="close">
                <Icon type="close-circled" color="red" size=25></Icon>
            </p>
            <div class="reasonDiv"><Input v-model="Opinion" type="textarea" readonly :autofocus="true" :rows="10"  ></Input></div>
            <p slot="footer"></p>
        </Modal>  
    </div>
</template>
<script>
export default {
  data() {
    const valid1 = (rule, value, callback) => {
      var temp = /^[0-9]\d*(\.\d)?$/;
      if (value||value==0) {
        if (temp.test(value) == false) {
          callback(new Error("必须是数字！"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    };
    return {
        isCreated:false,//是否需要显示报表
        ReportLine:'',//不显示报表时所显示文字
        ReasonShow:false,
        showType: false, //编辑框弹出状态
        yearList: this.GetGroupDict("ReportYear"),
        ReportId: "",
        ReportStatus: "",
        Opinion:'',
        AreaCode: this.GetlocaStorage("potUserinfo").AreaCode,
        dataList: [],
        VarietyList:this.GetGroupDict("PotatoVariety"),
        rule1: valid1, //验证是否是两位小数点
        dataModel: {
        //编辑模型
        Id: 0,
        ReportId: "",
        ZPyield: "",
        ZPvariety: "",
        YYZdpArea: "",
        YYZsingleArea: "",
        YYZavgYield: "",
        YYZvariety: "",
        YYZplantTimes: "",
        YZarea: "",
        YZmuYield: "",
        YZyyzOrigin: "",
        YZvariety: "",
        YZoriginPlace: "",
        YJZarea: "",
        YJZmuYield: "",
        YJZvariety: "",
        YJZoriginPlace: "",
        Remark: ""
      },
        clientHeight: window.innerHeight - 226, //表格默认高度
        //查询模型：根据需求删除不不要查询条件
        searchModel: {       
            ReportCode:'PotSeed' ,
            FillInYear: new Date().getFullYear() + "",
            PageNumber: 1,
            PageSize: 20
        }
    };
  },
  mounted() {
    //table高度计算方法
    const that = this;
    window.onresize = () => {
      return (() => {
        that.clientHeight = window.innerHeight - 226;
      })();
    };
  },
  methods: {
        getPageData() {
            var self = this;
            self.$http.get("PotSeed", {params: {AreaCode: this.AreaCode,FillInYear: this.searchModel.FillInYear}}).then(function(res) {
                if (res.data.status === 1) {
                    self.dataList = res.data.model.list;
                    self.ReportId = res.data.model.ReportId;
                    self.ReportStatus = res.data.model.ReportStatus;
                    self.Opinion = res.data.model.Opinion;
                    self.isCreated = true;
                } else {
                    self.isCreated = false;
                    self.ReportLine = '报表未生成！';
                    self.$Modal.error({ title: "提示信息", content: res.data.message });
                }
                });
        },
        //编辑获取对象传入id
        editInfo(id) {
        //编辑
            var self = this;
            this.$http.get("PotSeed", { params: { id: id } }).then(
                //获取数据编辑项的值
                function(res) {
                if (res.data.status == 1) {
                    self.dataModel = res.data.model;
                    self.modalShow(); //打开modal
                } else {
                    self.$Modal.error({
                    title: "提示信息",
                    content: "编辑数据加载失败!!!"
                    });
                }
                }
            );
        },
        //新增
        addItem() {
            let model = {
                //编辑模型
                Id: '',
                ReportId: "",
                ZPyield: "",
                ZPvariety: "",
                YYZdpArea: "",
                YYZsingleArea: "",
                YYZavgYield: "",
                YYZvariety: "",
                YYZplantTimes: "",
                YZarea: "",
                YZmuYield: "",
                YZyyzOrigin: "",
                YZvariety: "",
                YZoriginPlace: "",
                YJZarea: "",
                YJZmuYield: "",
                YJZvariety: "",
                YJZoriginPlace: "",
                Remark: ""
            };
            model.ReportId = this.ReportId;
            this.dataList.push(model);
        },
        //删除对象
        delInfo(index) {
            var self = this;
            if (this.ReportStatus < 3) {
                this.dataList.splice(index, 1);
            } else {
                this.$Modal.warning({
                title: "提示信息",
                content: "你已经上报过了，不能再更改纪录!"
                });
            }
        },
        //保存方法
        save(modelname) {
            var self = this;
            this.$refs[modelname].validate(valid => {
                if (valid) {
                    this.$http.post("PotSeed", this.dataList).then(function(res) {
                        if (res.data.status == 1) {
                            self.getPageData(); //读取分页数据
                            self.$Notice.success({ title: "保存成功！", desc: false });
                        } else {
                            self.$Modal.warning({
                            title: "提示信息",
                            content: res.data.message
                            });
                        }
                    });
                }
                else{
                    self.$Modal.error({ title: "提示信息", content: '无法保存，请检查是否有未填项！' });
                }
            });
        },
        //数据上报
        DataUp() {
            var self = this;
            let model = new Object();
            model.Id = this.ReportId;
            model.Status = 3;
            model.Opinion = '';
            self.$Modal.confirm({
                title: '提示信息',
                content: '<p>数据上报后，不能再更改，是否继续上报？</p>',
                onOk: () => {
                    this.$http.post("Report/PostUpStatus", model).then(
                        function (res) {
                            if (res.data.status == 1) {
                                self.$Notice.success({ title: '数据上报成功！', desc: false });
                                self.getPageData();
                            }
                            else {
                                self.$Modal.error({ title: "提示信息", content: "数据上报失败!" });
                            }
                        }
                    );
                }
            });
        },
        //模板下载
        TmpDown:function(){
            window.open(this.$http.defaults.baseURL + "Report/GetTemplateData?ReportCode=" + this.searchModel.ReportCode);
        },
         //导入
        GetPostUrl() {
            var url = this.$http.defaults.baseURL + "PotSeed/PostImportData?ReportId=" + this.ReportId;
            return url;
        },
        //导入成功反馈事件
        handleSuccess(res, file) {
            var self = this;
            self.getPageData();
            if(res.status == -1){
                self.$Modal.warning({
                    title: "提示信息",
                    content: res.message
                });
            }else{
                self.$Notice.success({
                    title: '数据导入成功！',
                    desc: false
                });
            }            
        },
        //导出
        ExcelDown: function () {           
            window.open(this.$http.defaults.baseURL + "PotSeed/GetExcelData?FillInYear="  + this.searchModel.FillInYear + "&&AreaCode=" + this.AreaCode);
        },
        initReport(){
            var today = new Date();
            let currentYear = today.getFullYear();
            let currentMonth = today.getMonth() + 1;
            if(this.searchModel.FillInYear*1 == currentYear &&currentMonth==12){
               this.getPageData();
            }
            else if(this.searchModel.FillInYear*1 == currentYear-1 && currentMonth >= 1 && currentMonth <= 5){
                this.getPageData();
            }
            else if(this.searchModel.FillInYear < currentYear){
                this.getPageData();
            }
            else {
                this.isCreated = false;
                this.ReportLine = '不在填报时间内！';
            }
        }
  },
  //创建Vue页面方法
  created: function() {
    //创业Vue前调用获取this.datas: {},//table数据对象
    this.initReport();
  },
  watch: {
    //需要监听的在此处新增监听对象
  }
};
</script>
